<%@ page language="java" contentType="text/html; charset=utf-8"
    pageEncoding="utf-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Insert title here</title>
<style>
/* #wapper{
	width:100%;
	height:768px;
	margin-left : auto;
	margin-right : auto;
	border : 2px solid #000000; 
	border-top : 2px solid #000000;
}
#banner{
	width:100%;
	height:5em;
	border : 2px solid green; 
}
#sidebar{
	float:left;
	width:15em;
	padding-bottom: 5em;
	padding-top:5em;
	border : 2px solid blue; 
}
#main{
	margin-left:15em;
	padding-bottom: 5em;
	padding-top:5em;
	border : 2px solid red; 
}
#footer{
	width:100%;
	height:5em;
	border : 2px solid orange; 
} */

body{
	font-size: 62.5%;
	margin: 0;
	padding: 0;
	background-color: #FFFFFF;
}
p,h1,h2,h3,h4,h5,h5,ol,ul {
	margin: 0px;
	padding: 0px;
}

#wapper{
	border : 2px solid #000000; 
	width:760px;
}
#banner{
	background:url(/img/banner_bg.jpg) repeat-x left top;
	border : 2px solid green;
	position: relative; 
}
#logo{
	background: url(/img/banner_flower.jpg) no-repeat right top;
	height: 100px;
}
#nav{
	margin-bottom:0px;
	position:absolute;
	top:75px;
	left:5px;
}

#nav li {
	list-style-type:none;
	padding:0;
	margin:0;
	float:left;
}

#nav a {
	display:block;
	font-size:11px;
	padding:2px 2px 2px 2px;
	width:8em;
	margin-left : 2px;
	background-color : orange;
	
}
/**SIDE BAR*/
#sidebar{
	border : 2px solid blue;
	float:left;
	margin-top:10px;
	width:160px; 
	display:block;
}

#news{
	list-style:none;
	padding:0;
	margin:0;
	font-size:1.2em;
	
}
#news li{
	display:inline;
}

#news a {
	display:block;
	padding:5px;
	line-height: 110%;
}
/** MAIN */
#main{
	border : 2px solid red; 
	margin-left:180px;
}
#footer{
	border : 2px solid orange;
	margin-top:15px;
	border-top: 1px dashed orange; 
	padding : 5px 0 0 5px;
}
</style>
</head>
<body>
<div id="wapper">
<div id="banner">
	<div id="logo">
		<img src="/img/logo.jpg" width="553" height="70"/>
	</div>
	<div id="nav">
		<ul>
			<li><a>首页</a></li>
			<li><a>次页</a></li>
		</ul>
	</div>
</div>
<div id="sidebar">
	<ul id="news">
		<li><a href="#">纵菜单1</a></li>
		<li><a href="#">纵菜单2</a></li>
		<li><a href="#">纵菜单3</a></li>
		<li><a href="#">纵菜单1</a></li>
		<li><a href="#">纵菜单2</a></li>
		<li><a href="#">纵菜单3</a></li>
	</ul>
</div>
<div id="main"></div>
<div id="footer"></div>
</div>
</body>
</html>